2. Displaying a Web Page
Our modal web view
controller code references an HTML page whose content should be
displayed in the info panel. This is a standard HTML/CSS document,
which displays some text and an image. That file is included in the
source code archive for this book (along with the image file it
references, booktitle.png). You can copy both files from the source code archive into your project, or just make a new empty bookInfo.html
file in your Xcode project using the New File Assistant (pick Empty
File from the Other section) and giving it something like the following
content:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=540" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Beginning iPad Development for iPhone Developers: Mastering the iPad SDK</title>
<style type="text/css">
<!--
body {
background: #000 url(booktitle.png) fixed bottom no-repeat;
margin: 0px;
font-family: Arial, Helvetica, sans-serif;
font-size: 20px;
color: #FC3;
}
a:link { color: #FFF; }
a:visited { color: #FFF; }
a:hover { color: #FFF; }
a:active { color: #FFF; }
.intro { padding: 30px; -align: center; }
-->
</style></head>
<body><div class="intro">Leverage your iPhone development skills to build apps for the iPad. Learn how to utilize all of the new iPad SDK features from <b>Dudel</b> in your own apps, plus so much more! This book includes the full source code for <b>Dudel</b>.
</p>
</body>
</html>
3. Integrating with the Dudel View Controller
Now let's deal with DudelViewController, where we'll tie up the loose ends needed to display this web view. Start with the DudelViewController.h file, adding this line:
#import "ModalWebViewController.h"
Also add one more protocol to the list for the DudelViewController class:
@interface DudelViewController : UIViewController <ToolDelegate, DudelViewDelegate,
MFMailComposeViewControllerDelegate, UIPopoverControllerDelegate,
FileRenameViewControllerDelegate, ModalWebViewControllerDelegate > {
Then switch to DudelViewController.m and fill out the following method, which was previously empty:
- (void)showAppInfo {
// The About the Book button was tapped, so display the Modal Web View.
ModalWebViewController *controller = [[[ModalWebViewController alloc]
initWithNibName:@"ModalWebViewController" bundle:nil] autorelease];
controller.delegate = self;
// UIModalPresentationFormSheet has a fixed 540 pixel width and 620 pixel height.
controller.modalPresentationStyle = UIModalPresentationFormSheet;
[self presentModalViewController:controller animated:YES];
}
Finally, handle the removal of the modal web view by implementing the following delegate method to dismiss it:
- (void)modalWebViewControllerDidFinish:(ModalWebViewController *)controller {
[self dismissModalViewControllerAnimated:YES];
}
Now you should be able to
build and run the app, bring up the info panel through the action menu,
and see something very much like the handsome page shown in Figure 2.
Obviously, you'll be missing
most of that if you didn't copy the image from the book's source code
archive, but you get the idea.